<template>
  <div class="setting">
    <!-- <div class="message-other">
      <div class="message-left">修改密码</div>
      <div class="person-desc2"> <img
          class="person-desc2-img"
          src="../../images/fanhui@2x.png"
          alt=""
        ></div>
    </div> -->
    <!-- <div class="message-other2">
             <div class="message-left">账号绑定</div>
            <div class="person-desc2"> <img class="person-desc2-img" src="../../images/fanhui@2x.png" alt=""></div>
        </div>
        <div class="message-other">
              <div class="message-left">清除缓存</div>
            <div class="person-desc2"> 43M<img  class="person-desc2-img" src="../../images/fanhui@2x.png" alt=""
           ></div>
        </div> -->
    <div
      class="message-other"
      @click="linkTo('/helpCenter')"
    >
      <div class="message-left">帮助中心</div>
      <div class="person-desc2"> <img
          class="person-desc2-img"
          src="../../images/fanhui@2x.png"
          alt=""
        ></div>
    </div>
    <div
      class="message-other2"
      @click="linkTo('/connectServer')"
    >
      <div class="message-left">联系客服</div>
      <div class="person-desc2">13715288274<img
          class="person-desc2-img"
          src="../../images/fanhui@2x.png"
          alt=""  
        ></div>
    </div>
    <div class="reback">
      意见反馈
    </div>

  </div>
</template>
<script>
export default {
  methods: {
    linkTo(link) {
      this.$router.push(link);
    }
  }
};
</script>
<style lang="less">
.setting {
  position: relative;
  overflow: hidden;
  .message-other {
    position: relative;
    width: 7.5rem;
    height: 1rem;
    background: rgba(255, 255, 255, 1);
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-left: 0.24rem;
    padding-right: 0.28rem;
    box-sizing: border-box;
    .message-left {
      font-size: 0.28rem;
      font-family: PingFang-SC-Medium;
      font-weight: 500;
      color: rgba(51, 51, 51, 1);
    }
    .person-desc {
      .person-desc-img {
        width: 0.96rem;
        height: 0.96rem;
        border-radius: 50%;
      }
    }
    .person-desc2 {
      font-size: 0.28px;
      // width: 6.9375rem /* 111/16 */
      font-family: PingFang-SC-Medium;
      font-weight: 500;
      color: rgba(102, 102, 102, 1);
      line-height: 0.31rem;
      .person-desc2-img {
        margin-left: 0.26rem;
        width: 0.12rem;
        height: 0.22rem;
      }
    }
    .person-desc3 {
      .person-desc2;
      color: rgba(126, 86, 198, 1);
    }
  }
  .message-other :after {
    // content: " ";
    // position: absolute;
    // height: 1px;
    // right: 0;
    // bottom: 0;
    // left: 0.24rem;
    // background-color: RGBA(232, 232, 232, 1);
  }
  .message-other2 {
    .message-other;
    height: 1rem;
    margin-bottom: 0.2rem;
    p {
      font-size: 0.28rem;
      font-family: PingFang-SC-Medium;
      font-weight: 500;
      color: #333333;
    }
  }
  .reback {
    position: relative;
    left: 50%;
    margin-top: 0.8rem;
    transform: translateX(-50%);
    width: 5rem;
    height: 0.88rem;
    background: rgba(126, 86, 198, 1);
    border-radius: 0.44rem;
    font-size: 0.32rem;
    font-family: PingFang-SC-Medium;
    font-weight: 500;
    color: rgba(255, 255, 255, 1);
    text-align: center;
    line-height: 0.88rem;
  }
}
</style>
